import Vue from 'vue'
import VueRouter from 'vue-router'
// 引入 store
import store from '@/store'


const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}


Vue.use(VueRouter)

// 路由规则（添加需要认证的 requiresAuth 信息）
const routes = [
  {
    path: '/test',
    name: 'test',
    component: () => import(/* webpackChunkName: 'demo' */'@/views/test/index')
  },
  {
    path: '/transition',
    name: 'transition',
    component: () => import(/* webpackChunkName: 'demo' */'@/components/transition/index'),
    props: true
  },
  {
    path: '/payPage',
    name: 'payPage',
    component: () => import(/* webpackChunkName: 'pay' */'@/views/shoppingCart/components/pay.vue')
  },
  {
    path: '/login',
    name: 'login',
    component: () => import(/* webpackChunkName: 'login' */'@/views/login/index')
  },
  {
    path: '/',
    component: () => import(/* webpackChunkName: 'layout' */'@/views/layout/index'),
    // 直接给某个路由设置，这时内部的子路由都需要认证（包含当前路由）
    // meta: { requiresAuth: true },
    children: [
      {
        path: '',
        name: 'home',
        component: () => import(/* webpackChunkName: 'home' */'@/views/home/index')
      },
      {
        path: '/courselist',
        name: 'courselist',
        component: () => import(/* webpackChunkName: 'course' */'@/views/selectCourse/index'),
        redirect: '/courselist/free',
        children: [
          {
            path: '/courselist/free',
            name: 'free',
            component: () => import(/* webpackChunkName: 'course' */'@/views/selectCourse/components/free.vue'),
            props: true
          },
          {
            path: '/courselist/toll',
            name: 'toll',
            component: () => import(/* webpackChunkName: 'course' */'@/views/selectCourse/components/toll.vue'),
            props: true
          }
        ]
      },
      {
        path: '/userhome',
        name: 'userhome',
        component: () => import(/* webpackChunkName: 'user' */'@/views/user/userHome.vue'),
        redirect: '/userhome/freeCourse',
        children: [
          {
            path: '/userhome/freeCourse',
            name: 'freeCourse',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/freeCourse.vue'),
            props: true
          },
          {
            path: '/userhome/tollCourse',
            name: 'tollCourse',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/tollCourse.vue'),
            props: true
          },
          {
            path: '/userhome/myCollect',
            name: 'myCollect',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/myCollect.vue'),
            props: true
          },
          {
            path: '/userhome/oder',
            name: 'oderList',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/oder.vue'),
            props: true
          },
          {
            path: '/userhome/myInfo',
            name: 'myInfo',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/myInfo.vue'),
            props: true
          },
          {
            path: '/userhome/shopAddress',
            name: 'shopAddress',
            component: () => import(/* webpackChunkName: 'user' */'@/views/user/components/shopAddress.vue'),
            props: true
          }
        ]
      },
      {
        path: '/courseDetail',
        name: 'courseDetail',
        component: () => import(/* webpackChunkName: 'detail' */'@/views/courseDetail/index.vue')
      },
      {
        path: '/videoDetail',
        name: 'videoDetail',
        component: () => import(/* webpackChunkName: 'video' */'@/views/videoDetail/index.vue')
      },
      {
        path: '/shoppingCart',
        name: 'shoppingCart',
        component: () => import(/* webpackChunkName: 'shop' */'@/views/shoppingCart/index.vue'),
        redirect: '/shoppingCart/cart',
        children: [
          {
            path: '/shoppingCart/cart',
            name: 'cart',
            component: () => import(/* webpackChunkName: 'shop' */'@/views/shoppingCart/components/cart.vue')
          },
          {
            path: '/shoppingCart/oder',
            name: 'oder',
            component: () => import(/* webpackChunkName: 'shop' */'@/views/shoppingCart/components/oder.vue'),
            props: true
          }
        ]
      }
    ]
  }
]

const router = new VueRouter({
  routes
})

router.beforeEach((to, from, next) => {
  // 验证 to 路由是否需要进行身份认证
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 验证 Vuex 的 store 中的登录用户信息是否存储
    if (!store.state.user) {
      // 未登录，跳转到登录页
      return next({
        name: 'login',
        query: {
          // 将本次路由的 fullPath 传递给 login 页面
          redirect: to.fullPath
        }
      })
    }
    // 已经登录，允许通过
    next()
  } else {
    next()
  }
})

export default router
